<template>
	<a-modal
		:visible="props.visible"
		:title="followUpTitle"
		:width="600"
		:confirmLoading="followLoading"
		@cancel="cancelFollow"
		@ok="confirmFollow"
	>
		<a-space class="mb-4">
			<a-select
				show-search
				placeholder="请输入搜索选择联系人"
				:options="personOptions"
				style="width: 196px"
				label-in-value
				:filter-option="false"
				@search="handleSearch"
				@change="personChange"
			></a-select>
			<a-select
				v-model:value="followForm.followType"
				:options="followOptinos"
				placeholder="请选择跟进方式"
				class="w-[170px]"
			>
			</a-select>
			<a-select
				v-model:value="followLevel"
				:options="levelOptions"
				label-in-value
				placeholder="请选择等级"
				class="w-[170px]"
				@change="levelChange"
			></a-select>
		</a-space>
		<div class="mb-[4px]">
			<div class="flex justify-between items-center">
				<div>
					<span class="pr-[16px]">是否添加微信 </span>
					<a-radio-group v-model:value="followForm.is_wx_code" button-style="solid" style="padding-bottom: 10px">
						<a-radio :value="1">是</a-radio>
						<a-radio :value="0">否</a-radio>
					</a-radio-group>
				</div>
				<!--				<a-button v-if="followForm.type === 4" type="primary" @click="onTransfer">转客户</a-button>-->
			</div>
		</div>

		<template v-if="props.type === 1">
			<div class="mb-[16px]">
				<span class="pr-[16px]">客户意向产品 </span>
				<a-cascader
					v-model:value="followForm.serviceIds"
					:options="categoryOptions"
					:show-search="{ filter: categoryFilter }"
					placeholder="请选择"
					class="w-[440px]"
					@change="onCategoryChange"
				/>
			</div>
			<div class="mb-[16px]">
				<span class="pr-[16px]">预估成交金额 </span>
				<a-input-number
					v-model:value="followForm.predictAmount"
					:step="0.01"
					:min="0"
					:formatter="limitNumber"
					:parser="limitNumber"
					controls-position="right"
					placeholder="请输入"
					class="w-[140px]"
				/>
			</div>
		</template>

		<a-textarea v-model:value="followForm.content" placeholder="请输入跟进内容" :rows="8" />
	</a-modal>
</template>
<script setup>
	import customerLevelApi from '@/api/biz/crm/customerLevelApi'
	import claimApi from '@/api/biz/claimApi'
	import tool from '@/utils/tool'
	import { message } from 'ant-design-vue'
	import erpProjectApi from '@/api/erp/erpProjectApi'
	import { globalStore } from '@/store'

	const store = globalStore()

	const props = defineProps({
		visible: {
			type: Boolean,
			default: false
		},
		title: {
			type: String
		},
		customerCode: {
			type: String
		},
		personData: {
			type: Array
		},
		type: {
			// 0-转客户 1-私海新增跟进 2-公海新增跟进 3-转线索 4-线索私海新增跟进 5-线索公海新增跟进 6-线索转客户
			type: Number,
			required: true
		},
		list: {
			type: Array
		}
	})
	onBeforeMount(() => {
		personOptions.value = props.personData.map((item) => {
			return {
				value: item.id,
				label: item.contactsName
			}
		})
	})

	const limitNumber = (value) => {
		return value.replace(/^\D*([0-9]\d*\.?\d{0,2})?.*$/, '$1') || '0.00'
	}

	const followUpTitle = ref(props.title)

	/**
	 * 意向产品
	 */
	const categoryOptions = ref([])
	erpProjectApi.serviceProjectTree().then((res) => {
		categoryOptions.value = res
	})
	const categoryFilter = (inputValue, path) => {
		return path.some((option) => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1)
	}
	const onCategoryChange = (value, selectedOptions) => {
		followForm.value.serviceNames = selectedOptions ? selectedOptions.map((item) => item.label) : []
	}

	const personOptions = ref([])
	const emits = defineEmits(['update:visible', 'finished'])
	const followForm = ref({
		customerCode: '',
		userId: '',
		userName: '',
		followType: undefined,
		customerLevelId: '',
		customerLevelName: '',
		is_wx_code: 1,
		content: '',
		serviceIds: [],
		serviceNames: [],
		predictAmount: '',
		type: props.type
	})
	const followOptinos = tool.dictList('FOLLOW')
	const personChange = (select) => {
		followForm.value.userId = select.value
		followForm.value.userName = select.label
	}
	const levelChange = (select) => {
		followForm.value.customerLevelId = select.value
		followForm.value.customerLevelName = select.label
	}
	const handleSearch = (val) => {
		personOptions.value = props.personData
			.filter((item) => item.contactsName.includes(val))
			.map((item) => {
				return {
					value: item.id,
					label: item.contactsName
				}
			})
	}
	/**
	 * 获取客户等级选项
	 */
	const levelOptions = ref([])
	customerLevelApi.list().then((res) => {
		levelOptions.value = res.map((item) => {
			return {
				value: item.id,
				label: item.name
			}
		})
	})
	const followLevel = ref(null)
	const cancelFollow = () => {
		followLevel.value = null
		followForm.value = {
			customerCode: '',
			userId: '',
			userName: '',
			followType: '',
			customerLevelId: '',
			customerLevelName: '',
			is_wx_code: 1,
			content: '',
			type: props.value
		}
		emits('update:visible', false)
		store.setTransferStatus(false)
	}
	const followLoading = ref(false)
	const confirmFollow = () => {
		const { userId, followType, customerLevelId } = followForm.value
		if (!userId) {
			return message.warning('请选择联系人')
		}
		if (!followType) {
			return message.warning('请选择跟进方式')
		}
		// 0-转客户 1-私海新增跟进 2-公海新增跟进 3-转线索 4-线索私海新增跟进 5-线索公海新增跟进 6-线索转客户
		if ([1, 2].includes(props.type) && !customerLevelId) {
			return message.warning('请选择等级')
		}

		followForm.value.customerCode = props.customerCode
		if (props.list && props.list.length > 0) {
			followForm.value.list = props.list
		}

		const { serviceIds, serviceNames } = followForm.value
		let serviceClassId = '',
			serviceTypeId = '',
			serviceProjectId = '',
			serviceClassName = '',
			serviceTypeName = '',
			serviceProjectName = ''
		if (serviceIds && serviceIds.length) {
			serviceClassId = serviceIds[0]
			serviceTypeId = serviceIds[1]
			serviceProjectId = serviceIds[2]

			serviceClassName = serviceNames[0]
			serviceTypeName = serviceNames[1]
			serviceProjectName = serviceNames[2]
		}

		followLoading.value = true
		claimApi
			.transferToCustomer({
				...followForm.value,
				serviceClassId,
				serviceTypeId,
				serviceProjectId,
				serviceClassName,
				serviceTypeName,
				serviceProjectName
			})
			.then(() => {
				followLoading.value = false
				emits('finished', followForm.value.type)
				cancelFollow()
			})
			.finally(() => {
				followLoading.value = false
			})
	}

	// 转客户
	const onTransfer = () => {
		if (followForm.value.type === 4) {
			// 线索私海
			followUpTitle.value = '转客户'
			followForm.value.type = 6
		}
	}
</script>
